@extends('layout.admin')

@section("title")
    组织机构列表
@endsection

@section('content')
    {{--修改样式--}}
    <style>
        .layui-input {
            width: 60% !important;
        }

        .layui-edge {
            right: 161px !important;
        }

        .layui-form-select dl {
            min-width: 60% !important;
        }

        .layui-form-label {
            width: 134px !important;
        }

        .layui-input-block {
            margin-left: 164px !important;
        }
    </style>
    <link href="{{asset('css/tree/tree.css')}}" rel="stylesheet" />
    <div class="layui-card-body ">
        <form class="layui-form layui-col-space5">
            @can('admin.org.create')
                <div class="layui-inline layui-show-xs-block">
                    <a onclick="admin.openLayerForm('{{ route("admin.org.create",["parent_id"=>0]) }}', '添加组织', 'POST', '500px', '420px',0,'#org_create')"
                       class="layui-btn" data-type="auto" id="create"><i class="layui-icon"></i>添加</a>
                </div>
            @endcan
        </form>
    </div>
    <div class="layui-card-body ">
        <table class="layui-table layui-form" id="tree-table" lay-size="sm"></table>
        @if($error>0)
            <table class="layui-table layui-form" lay-size="sm">
                <thead>
                <tr data-id="0">
                    <th>ID</th>
                    <th>排序</th>
                    <th>名称</th>
                    <th>父级ID</th>
                    <th>辖下组织机构数量</th>
                    <th>备注/说明</th>
                    <th style="text-align:center;">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr class="" data-id="1" data-pid="0">
                    <td colspan="7" style="text-align: center">没有数据</td>
                </tr>
                </tbody>
            </table>
        @endif
        <div class="layui-card-body ">
            <table class="layui-table layui-form" id="tree-table" lay-size="sm"></table>
        </div>
    </div>
@endsection

@section('script')
    <script src="{{asset('js/table/tree.js')}}"></script>
    <script>
        layui.use(['form', 'table', 'treeTable'], function () {
            var form = layui.form;
            var treeTable = layui.treeTable;
            treeTable.render({
                elem: '#tree-table',
                data: {!! $orgs !!},
                icon_key: 'name',
                parent_key: "parent_id",
                end: function (e) {
                    form.render();
                },
                cols: [
                    {
                        key: 'id',
                        title: 'ID',
                    },
                    {
                        key: 'sort',
                        title: '排序',
                        template: function (item) {
                            return "<div data-id="+item.id+" class='sort-blur' contenteditable=true>"+item.sort+"</div>"
                        }
                    },
                    {
                        key: 'name',
                        title: '名称',
                        template: function (item) {
                            if (item.parent_id == 0) {
                                return '<span style="color:red;">' + item.name + '</span>';
                            } else {
                                return '<span style="color:green;">' + item.name + '</span>';
                            }
                        }
                    },
                    {
                        key: 'parent_id',
                        title: '父级ID',
                    },
                    {
                        key: 'children_num',
                        title: '辖下组织机构数量',
                    },
                    {
                        key: 'description',
                        title: '备注/说明',
                    },
                    {
                        title: '操作',
                        align: 'center',
                        template: function (item) {
                            //添加
                            let url = '{{ route("admin.org.create",["parent_id"=>"xxx"]) }}'.replace(/xxx/, item.id);
                            //编辑
                            let url_edit = '{{ route("admin.org.edit",["org"=>"xxx"]) }}'.replace(/xxx/, item.id);
                            //删除
                            let url_del='{{ route("admin.org.destroy",["id"=>"xxx"]) }}'.replace(/xxx/, item.id);
                            if (item.parent_id != 0) {
                                return '@if(_can("admin.org.create"))<a onclick="admin.openLayerForm(\'' + url + '\', \'添加组织\', \'POST\', \'500px\', \'420px\',0,\'#org_create\')" class="layui-btn layui-btn-xs btn_edit" data-method="edit" data-type="auto" data-id="' + item.id + '">添加</a> @endif' +
                                    '@if(_can("admin.org.edit"))<a onclick="admin.openLayerForm(\'' + url_edit + '\', \'修改组织\', \'POST\', \'500px\', \'420px\',0,\'#org_edit\')" class="layui-btn layui-btn-xs btn_edit" data-method="edit" data-type="auto" lay-filter="edit">编辑</a> @endif'+
                                '@if(_can("admin.org.destroy"))<a onclick="admin.tableDataDelete(\'' + url_del + '\', this, \'是否删除当前组织机构\')" class="layui-btn layui-btn-xs btn_edit" data-method="edit" data-type="auto" lay-filter="edit">删除</a> @endif';
                            } else {
                                return '@if(_can("admin.org.create"))<a onclick="admin.openLayerForm(\'' + url + '\', \'添加组织\', \'POST\', \'500px\', \'420px\',0,\'#org_create\')" class="layui-btn layui-btn-xs btn_edit" data-method="edit" data-type="auto" data-id="' + item.id + '">添加</a> @endif' ;
                            }
                        }
                    }
                ]
            });
            //排序
            $(".sort-blur").blur(function (){
                let id = $(this).context.dataset.id;
                let sort = $(this).context.innerText;
                let reg=/(\w*)xxx(.*)YYY(.*)/g;

                let url = "{{ route('admin.org.edit.attach.1',['id'=>'xxx','sort'=>'YYY']) }}".replace(reg, "$1"+id+"$2"+sort);

                @if(_can("admin.org.edit.attach.1"))
                admin.send(url);
                @endif
            })
        });
    </script>
@endsection
